<!--
  Generated template for the UserBaseInfoPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<!-- <ion-header>

  <ion-navbar>
    <ion-title>申请人信息</ion-title>
  </ion-navbar>

</ion-header> -->
<ion-header>
    <ion-navbar>
      <!-- <ion-icon name="arrow-back"><span>返回</span></ion-icon> -->
      <ion-title>申请人信息</ion-title>
    </ion-navbar>
  </ion-header>

<ion-content>
    <div class="head-setp">
        <div class="setp">
            <div class="setp-tips-box">
                <span class="active">申请人信息</span><span class="">车辆信息</span><span class="">证件照片</span><span class="">收货地址</span>
            </div>
            <div class="setp-dot-box">
                <span class="active"></span><span class="active setp-line"></span><span class=""></span><span class="setp-line"></span>
                <span class="">
                </span><span class="setp-line"></span><span class=""></span>
            </div>
        </div>
    </div>
    <div class="form-box" style="pointer-events: auto;">
        <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <h2>申请人信息</h2>
            </div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>姓名</label>
                <input type="text" name="" placeholder="请输入姓名" [(ngModel)]="name" maxlength="20">
            </div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>性别</label> <div class="sex-box">
                    <span [ngClass]="{'active':sex===1}" (click)="switchSex(1)"></span><b (click)="switchSex(1)">男</b>
                    <span [ngClass]="{'active':sex===0}" (click)="switchSex(0)"></span><b (click)="switchSex(0)">女</b>
                </div>
            </div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>身份证号</label> <input type="text" name="" placeholder="请输入身份证号" [(ngModel)]="IDNumber" maxlength="18">
            </div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2"><label>手机号</label> <input type="tel" name="" placeholder="请输入手机号" [(ngModel)]="mobile" maxlength="11"></div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2"><label>邀请码（选填）</label> <input type="tel" name="" placeholder="请输入邀请码" [(ngModel)]="inviteMoblie" maxlength="11"></div>
        </div>
    </div>
    <div class="h10"></div>
    <div class="form-box" style="pointer-events: auto;">
        <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>是否为申请人本人车辆</label> <div class="sex-box self-box">
                    <span  [ngClass]="{'active':isSelf}" (click)="switchSelf(true)"></span><b (click)="switchSelf(true)">是</b> 
                    <span [ngClass]="{'active':!isSelf}" (click)="switchSelf(false)"></span><b (click)="switchSelf(false)">否</b>
                </div>
            </div>
        </div>
    </div>
    <div class="h10"></div>
    <div class="form-box" [hidden]="isSelf">
        <div class="inputBox padType2">
            <div class="input size-2 align-2"><h2>车主信息</h2></div>
        </div> <div class="inputBox padType2">
            <div class="input size-2 align-2"><label>车主姓名</label> <input type="text" name="" placeholder="请输入车主姓名" [(ngModel)]="carOwnerName" maxlength="20"></div>
        </div>
        <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>车主身份证号</label> <input type="text" name="" placeholder="请输入车主身份证号" [(ngModel)]="carOwnerIDNum" maxlength="18">
            </div>
        </div>
        <div class="inputBox padType2">
            <div class="input size-2 align-2">
                <label>手机号</label> <input type="tel" name="" placeholder="请输入手机号码" [(ngModel)]="carOwnerPhone" maxlength="11">
            </div>
        </div>
    </div>
    <div class="plr15 mt40" (click)="nextPage()" [ngClass]="{'disable':btnDisable===true}">
        <button ion-button block [color]="btnDisable===true?'light':''">下一步</button>
    </div>
    <div style="height: 40px; pointer-events: auto;"></div>
</ion-content>
